<!-- <react-example text="'text'"></react-example> -->

<rd-header>
  <rd-header-title title-text="Home">
    <a data-toggle="tooltip" title="Refresh" ui-sref="portainer.home" ui-sref-opts="{reload: true}">
      <i class="fa fa-sync" aria-hidden="true"></i>
    </a>
  </rd-header-title>
  <rd-header-content>Environments</rd-header-content>
</rd-header>

<motd-panel ng-if="motd && motd.Message !== '' && applicationState.UI.dismissedInfoHash !== motd.Hash" motd="motd" dismiss-action="dismissImportantInformation(motd.Hash)">
</motd-panel>

<kubernetes-feedback-panel></kubernetes-feedback-panel>

<information-panel ng-if="!isAdmin && endpoints.length === 0" title-text="Information">
  <span class="small text-muted">
    <p>
      <i class="fa fa-exclamation-circle orange-icon" aria-hidden="true" style="margin-right: 2px"></i>
      You do not have access to any environment. Please contact your administrator.
    </p>
  </span>
</information-panel>

<div
  class="row"
  style="width: 100%; height: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center"
  ng-if="state.connectingToEdgeEndpoint"
>
  Connecting to the Edge environment...
  <i class="fa fa-cog fa-spin" style="margin-left: 5px"></i>
</div>

<information-panel ng-if="isAdmin && endpoints.length === 0" title-text="Information">
  <span class="small text-muted">
    <p>
      <i class="fa fa-exclamation-circle orange-icon" aria-hidden="true" style="margin-right: 2px"></i>
      No environment available for management. Please head over the
      <a ui-sref="portainer.endpoints.new"> environments view </a>
      to add an environment.
    </p>
  </span>
</information-panel>

<div class="row" ng-if="!state.connectingToEdgeEndpoint">
  <div class="col-sm-12">
    <endpoint-list
      title-text="Environments"
      title-icon="fa-plug"
      table-key="home_endpoints"
      tags="tags"
      dashboard-action="goToDashboard"
      show-snapshot-action="isAdmin"
      snapshot-action="triggerSnapshot"
      edit-action="goToEdit"
      is-admin="isAdmin"
      retrieve-page="getPaginatedEndpoints"
      endpoint-init-time="state.homepageLoadTime"
    ></endpoint-list>
  </div>
</div>
